import React, { useRef } from 'react';

import Child from './Child';
import ForwordChild from './ForwordChild';

const App = () => {
  let myRef = null;

  const ref = useRef(null);
  return (
    <div>
      <div>
        <h1>原始</h1>
        <button
          type="button"
          onClick={() => {
            console.log('click', myRef);
            myRef.current.focus();
            myRef.current.value = '';
          }}
        >
          获取焦点
        </button>
        <Child
          cb={(el) => {
            myRef = el;
          }}
        ></Child>
      </div>
      <div>
        <h1>forword</h1>
        <button
          type="button"
          onClick={() => {
            console.log('click', ref);
            ref.current.focus();
            ref.current.value = '';
          }}
        >
          获取焦点
        </button>
        <ForwordChild ref={ref}></ForwordChild>
      </div>
    </div>
  );
};

export default App;
